<template>
  <div class="avatar-box">
    <el-button @click="btnClick">点击</el-button>
    <CropperImg v-model:dialogVisibleCorpper="dialogVisibleCorpper" @confirm="confirm" />
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";

const dialogVisibleCorpper = ref(false);
// 组件点击事件
const btnClick = () => {
  dialogVisibleCorpper.value = true;
};
// 组件提交事件
const confirm = () => {
  dialogVisibleCorpper.value = false;
};
</script>
<style lang="scss" scoped>
.avatar-box {
  width: 300px;
  display: flex;
  justify-content: center;
}
</style>
